<template>
  <view style="padding-bottom: 120rpx;">
    <u-navbar
      v-if="!$isWeixin()"
      :title="title"
      :titleWidth="450"
      :titleBold="true"
      :background="{ backgroundColor: '#ffffff' }"
      :is-fixed="true"
    ></u-navbar>

    <u-tabs active-color="#FF7A23" :list="tabList" :current="tabIndex" @change="index => (tabIndex = index)"></u-tabs>

    <view class="" v-if="tabIndex == 0"><relations :list="state.Dealer_RelationList"></relations></view>

    <view class="" v-if="tabIndex == 1">
      <basic-information
        v-if="state.ShowLevel == 1"
        :metadata="state.DataBaseInfo"
        :showOtherInfo="false"
        :showReview="false"
        :showGrade="false"
        :showParent="false"
        :loadCity="loadCity"
        :data="{
          Dealer_BaseInfo: state.First_Dealer_BaseInfo
        }"
      ></basic-information>

      <block v-if="state.ShowLevel == 2">
        <u-cell-item
          title="一级经销商名称"
          :arrow="false"
          :value="state.First_Dealer_BaseInfo.Name"
          :border-bottom="false"
        ></u-cell-item>
        <basic-information
          :metadata="state.DataBaseInfo"
          :showOtherInfo="false"
          :showReview="false"
          :showGrade="false"
          :showParent="false"
          :loadCity="loadCity"
          :data="{
            Dealer_BaseInfo: state.Double_Dealer_BaseInfo
          }"
        ></basic-information>
      </block>

      <block v-if="state.ShowLevel == 3">
        <u-cell-item title="一级经销商名称" :arrow="false" :value="state.First_Dealer_BaseInfo.Name"></u-cell-item>
        <u-cell-item
          title="二级经销商名称"
          :arrow="false"
          :value="state.Double_Dealer_BaseInfo.Name"
          :border-bottom="false"
        ></u-cell-item>
        <store-information :loadCity="loadCity" :data="state.Door_Dealer_BaseInfo"></store-information>
      </block>
    </view>

    <view style="" v-if="tabIndex == 2">
      <module-apply
        v-for="(item, index) in state.ModuleDetail"
        :applyType="2"
        :readonly="true"
        :selectType="1"
        :index="index"
        :key="index"
        :value="item"
      ></module-apply>
    </view>

    <view class="" v-if="tabIndex == 3">
      <module-apply
        v-for="(item, index) in state.ShellPrototypeDetail"
        :applyType="2"
        :readonly="true"
        :selectType="2"
        :index="index"
        :key="index"
        :value="item"
      ></module-apply>
    </view>

    <view class="" v-if="tabIndex == 4">
      <module-apply
        v-for="(item, index) in state.EntityPrototypeDetail"
        :applyType="2"
        :readonly="true"
        :selectType="3"
        :index="index"
        :key="index"
        :value="item"
      ></module-apply>
    </view>

    <view class="" v-if="tabIndex == 5">
      <u-cell-item
        title="门店现况实景照片"
        :arrow="false"
        style="padding-bottom: 0; padding-top: 0;"
        :border-bottom="false"
      ></u-cell-item>
      <u-cell-item :arrow="false" style="padding: 10rpx;">
        <image-upload
          :value="
            state.ApplyForPhoto.split(',').map(item => {
              return {
                Value: item
              };
            })
          "
          :readonly="true"
        ></image-upload>
      </u-cell-item>
      <u-cell-item
        title="申请时间"
        :arrow="false"
        :value="state.ApplicationDate | date('yyyy-mm-dd hh:MM')"
      ></u-cell-item>
    </view>

    <view class="" v-if="tabIndex == 6">
      <image-upload
        :readonly="true"
        :value="
          state.CompletionPhoto.split(',').map(item => {
            return {
              Value: item
            };
          })
        "
      ></image-upload>
    </view>

    <view class="" v-if="tabIndex == 7">
      <logistics-information :list="state.LogisticsList"></logistics-information>
    </view>

    <view class="" v-if="tabIndex == 8">
      <!-- <u-cell-item title="门店等级" :arrow="false">
				<u-radio-group :disabled="true" :value="state.DoorHandleInfo.Grade">
					<u-radio :name="1">A</u-radio>
					<u-radio :name="2">B</u-radio>
					<u-radio :name="3">C</u-radio>
				</u-radio-group>
			</u-cell-item> -->
      <u-cell-item title="模块化" :arrow="false">
        <u-radio-group :disabled="true" :value="state.DoorHandleInfo.Module">
          <u-radio :name="1">模块</u-radio>
          <u-radio :name="2">非模块</u-radio>
        </u-radio-group>
      </u-cell-item>
      <u-cell-item title="门头化" :arrow="false">
        <u-radio-group :disabled="true" :value="state.DoorHandleInfo.IsDoor">
          <u-radio :name="1">门头</u-radio>
          <u-radio :name="2">非门头</u-radio>
        </u-radio-group>
      </u-cell-item>
      <u-cell-item title="样机类型" :arrow="false">
        <u-checkbox-group :disabled="true">
          <u-checkbox :value="state.DoorHandleInfo.IsPrototype == 1 || state.DoorHandleInfo.IsPrototype == 3" :name="1">
            空壳样机
          </u-checkbox>
          <u-checkbox :value="state.DoorHandleInfo.IsPrototype == 2 || state.DoorHandleInfo.IsPrototype == 3" :name="2">
            实体样机
          </u-checkbox>
        </u-checkbox-group>
      </u-cell-item>
      <u-cell-item title="精选门店" :arrow="false">
        <u-radio-group :disabled="true" :value="state.DoorHandleInfo.IsGoodDoor">
          <u-radio :name="1">是</u-radio>
          <u-radio :name="2">否</u-radio>
        </u-radio-group>
      </u-cell-item>
    </view>

    <view class="btn-group-fixed"><u-button @tap="backToList">返回列表</u-button></view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      title: '模块及样机验收',

      tabList: [
        { name: '销售业务关系' },
        { name: '基础信息' },
        { name: '模块申请' },
        { name: '空壳样机申请' },
        { name: '实体样机申请' },
        { name: '上传申请文件' },
        { name: '验收照片' },
        { name: '物流信息' },
        { name: '处理意见' }
      ],
      tabIndex: 0,

      DealerId: 10195,
      SelectType: 1,
      AcceptanceAuditId: 1129,

      loadCity: false,

      state: {
        ShowLevel: null,
        First_Dealer_BaseInfo: {},
        Double_Dealer_BaseInfo: {},
        Door_Dealer_BaseInfo: {},
        DoorPhotoList: [],
        Dealer_RelationList: [],
        DataBaseInfo: {},
        ModuleDetail: [],
        ShellPrototypeDetail: [],
        EntityPrototypeDetail: [],
        OutdoorSuitsDetail: [],
        ModultMedalsDetail: [],
        ApplyForPhoto: '',
        ApplicationDate: null,
        ApplicationRemake: '',
        CompletionPhoto: '',
        State: null,
        StateName: '',
        FirstAuditNote: '',
        ReviewAuditNote: '',
        FinalAuditNote: '',
        DoorHandleInfo: {},
        LogisticsList: []
      }
    };
  },

  onLoad(options) {
    if (options.DealerId) {
      this.DealerId = options.DealerId;
    }
    if (options.AcceptanceAuditId) {
      this.AcceptanceAuditId = options.AcceptanceAuditId;
    }

    this.init();

    if (this.$isWeixin()) {
      this.$setTitle(this.title);
    }
  },

  methods: {
    init() {
      this.$u.api
        .getModuleAcceptanceReviewDetail({
          DealerId: this.DealerId,
          SelectType: this.SelectType,
          AcceptanceAuditId: this.AcceptanceAuditId
        })
        .then(res => {
          console.log(res);
          const { ResultCode, ResultData } = res;
          if (ResultCode === 1) {
            this.state = ResultData;

            this.state.ModuleDetail.forEach(item => {
              item.ApplyList.forEach(apply => {
                this.getProductList(apply.BrandId, 1).then(res => {
                  apply.ProductBaseList = res;
                });
              });
            });
            this.state.ShellPrototypeDetail.forEach(item => {
              item.ApplyList.forEach(apply => {
                this.getProductList(apply.BrandId, 2).then(res => {
                  apply.ProductBaseList = res;
                });
              });
            });

            this.state.EntityPrototypeDetail.forEach(item => {
              item.ApplyList.forEach(apply => {
                this.getProductList(apply.BrandId, 3).then(res => {
                  apply.ProductBaseList = res;
                });
              });
            });

            this.loadCity = true;
          }
        });
    },

    getProductList(brandId, selectType) {
      return new Promise((relove, reject) => {
        this.$u.api
          .getProductDic({
            SelectType: selectType,
            BrandId: brandId
          })
          .then(res => {
            const { ResultCode, ProductList } = res;
            if (ResultCode === 1) {
              relove(ProductList);
            }
          });
      });
    }
  }
};
</script>

<style lang="scss"></style>
